<ion-header>
  <ion-toolbar >

    <ion-buttons slot="start" >
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-label class="ion-text-center" >我的关注</ion-label>
  </ion-toolbar>
</ion-header>

<ion-content (ionScroll)="onScroll($event)" >

  <ion-refresher slot="fixed" (ionRefresh)="getFocusList($event)">
    <ion-refresher-content> </ion-refresher-content>
  </ion-refresher>
  <nzm-tabs
    [activeTab]="tabIndex"
    [page]="5"
    class="ion-padding-top local_tab_height"
    [prerenderingSiblingsNumber]="3"
    [useOnPan]="false"
    [animated]="false"
    (onChange)="onTabChange($event)"
  >
    <nzm-tab-pane [title]="myFocus"> </nzm-tab-pane>
    <nzm-tab-pane
      [title]="titleTemplate"
      *ngFor="let item of focusTypeNumber"
    >
      <ng-template #titleTemplate>
        <nzm-badge [text]="item.length">
          <div>{{ item.name }}</div>
        </nzm-badge>
      </ng-template>
    </nzm-tab-pane>
  </nzm-tabs>
  <div class="focus-list">
    <ion-list *ngIf="currentFocusList.length; else empty">
      <app-focus-item
        *ngFor="let item of currentFocusList"
        [data]="item"
      ></app-focus-item>
    </ion-list>

    <ng-template #empty> <app-empty>dddd </app-empty> </ng-template>
  </div>
</ion-content>
